<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>数字鸽业精准管控云服务平台</title>
    <!-- 获取本地IP地址 -->
    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
    <script type="text/javascript">
        var Ip = returnCitySN["cip"];
        var cityname = returnCitySN["cname"];
        localStorage.setItem("Ip", Ip);
    </script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .loading{
            width: 100px;
            height: 100px;
            margin: 350px auto;
        }
        .loadingtext {
            position: relative;
            top: 60px;
            left: -4px;
        }
        .box1,.box2{
            width: 40px;
            height: 40px;
            position: absolute;
        }
        .box1 div ,.box2 div{
            width: 10px;
            height: 10px;
            background-color: #409EFF;
            position: absolute;
            border-radius: 50%;
            animation: loading 1.5s infinite linear;
        }
        .box2{transform: rotate(45deg);}
        .box1 div:nth-child(1),.box2 div:nth-child(1){
            left: 0;
            top: 0;
        }
        .box1 div:nth-child(2),.box2 div:nth-child(2){
            right: 0;
            top: 0;
        }
        .box1 div:nth-child(3),.box2 div:nth-child(3){
            right: 0;
            bottom: 0;
            
        }
        .box1 div:nth-child(4), .box2 div:nth-child(4){
            left: 0;
            bottom: 0;
        }
        @keyframes loading{
            0%{
                transform: scale(1);
            }
            50%{
                transform: scale(0);
            }
            100%{
                transform: scale(1);
            }
        }
        .box1 div:nth-child(1){animation-delay: 0s;}
        .box2 div:nth-child(1){animation-delay: .2s;}
        .box1 div:nth-child(2){animation-delay: .4s;}
        .box2 div:nth-child(2){animation-delay: .6s;}
        .box1 div:nth-child(3){animation-delay: .8s;}
        .box2 div:nth-child(3){animation-delay: 1s;}
        .box1 div:nth-child(4){animation-delay: 1.2s;}
        .box2 div:nth-child(4){animation-delay: 1.4s;}
    </style>
    <link rel="shortcut icon" type="image/x-icon" href="static/peg.png">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.14.1/lib/theme-chalk/index.css">
  </head>
  <body>
    <div id="app"></div>
    <div class="loading" id="loading">
      <div class="box1">
        <div></div>
        <div></div>
        <div></div>
        <div></div>
      </div>
      <div class="box2">
        <div></div>
        <div></div>
        <div></div>
        <div></div>
      </div>
      <span class="loadingtext">加载中...</span>
    </div>
    <!-- built files will be auto injected -->
  </body>
</html>
